<template>

	<div>
		<el-dialog title="发放奖品" v-model="dialogVisible" @close="dialogFormVisible" :close-on-click-modal="false"
			:close-on-press-escape="false" class="max-w460">
			<el-form size="small" ref="form" :model="form">
				<el-form-item label="收件人" :label-width="formLabelWidth">
					{{ model.name }}
				</el-form-item>
				<el-form-item label="收件电话" :label-width="formLabelWidth">
					{{ model.phone }}
				</el-form-item>
				<el-form-item v-if="model.region" label="收件地址" :label-width="formLabelWidth">
					{{ model.region.province }}{{ model.region.city }}{{ model.region.region }}{{ model.detail }}
				</el-form-item>
				<el-form-item label="物流公司" prop="express_id" :rules="[{ required: true, message: ' ' }]"
					:label-width="formLabelWidth">
					<el-select size="small" v-model="form.express_id" placeholder="请选择" class="flex-1">
						<el-option v-for="(item, index) in expressList" :key="index" :label="item.express_name"
							:value="item.express_id"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="物流单号" :label-width="formLabelWidth" prop="express_no"
					:rules="[{ required: true, message: ' ' }]">
					<el-input type="textarea" v-model="form.express_no" placeholder="请输入物流单号"></el-input>
				</el-form-item>
			</el-form>
			<template #footer class="dialog-footer">
				<el-button @click="dialogFormVisible">取 消</el-button>
				<el-button type="primary" @click="submit" :loading="loading">确 定</el-button>
			</template>
		</el-dialog>
	</div>
</template>
<script>
	import {
		send
	} from "@/api/lottery.js";
	import draggable from "vuedraggable";
	export default {
		components: {
			draggable,
		},
		data() {
			return {
				loading: false,
				/*左边长度*/
				formLabelWidth: "120px",
				/*是否显示*/
				dialogVisible: false,
				form: {
					express_id: "",
					express_no: "",
				},
			};
		},
		props: ["open_send", "model", "expressList"],
		created() {
			this.dialogVisible = this.open_send;
		},
		methods: {
			/*处理*/
			submit() {
				let self = this;
				let form = self.form;
				form.record_id = self.model.record_id;
				self.$refs.form.validate((valid) => {
					if (valid) {
						self.loading = true;
						send(form, true)
							.then((data) => {
								self.loading = false;
								ElMessage({
									message: data.msg,
									type: "success",
								});
								self.dialogFormVisible(true);
							})
							.catch((error) => {
								self.loading = false;
							});
					}
				});
			},
			/*关闭弹窗*/
			dialogFormVisible(e) {
				if (e) {
					this.$emit("closeDialog", {
						type: "success",
						openDialog: false,
					});
				} else {
					this.$emit("closeDialog", {
						type: "error",
						openDialog: false,
					});
				}
			},
		},
	};
</script>
<style></style>